<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>购物车</title>
    <style>
        *{
            margin: 0 ;
            padding: 0;
            font-family: 'microsoft yahei';
            text-decoration: none;
        }
        .head{
            min-width: 1200px;
            height: 195px;
        }
        .hnvgt{
            min-width: 1200px;
            height: 40px;
            background-color: #333333;

        }
        .hnl{
            float: left;
            font-size: 12px;
            color: gray;
            width: 600px;
        }
        .xhnl{
            float: left;
            height: 40px;
            line-height: 40px;
            margin: 0 15px 0 0;
        }
        .hnr{
            float: right;
            font-size: 12px;
            color: gray;
            width: 400px;
        }
        .xhnr{
            float: right;
            height: 40px;
            line-height: 40px;
            margin: 0 0 0 15px;
        }
        .hsearch{
            min-width: 1200px;
            height: 155px;
            clear: both;
        }
        .hsc{
            width: 1200px;
            height: 155px;
            margin: 0 auto;
        }
        .hscs{
            width: 1200px;
            height: 115px;
            margin: 0 auto;
        }
        .hscsl{
            width: 210px;
            height: 115px;
            float: left;
        }
        .logo{
            margin: 42px 0;
        }
        .hscsm{
            width: 990px;
            height: 115px;
            float: left;
        }
        .hm{
            width: 730px;
            float: right;
            height: 85px;
            margin: 30px 0;
        }
        .hms{
            width: 730px;
            height: 42px;
        }
        .hmsl{
            width: 535px;
            height: 40px;
            border: 1px solid darkgreen;
            float: left;
        }
        .dz{
            font-size: 12px;
            color:darkgrey;
            margin: 12px 0 0 20px;
            float: left;
        }
        .fdj{
            width: 74px;
            height: 40px;
            background-color: #2fab3c;
            float: right;
        }
        .hmsr{
            width: 158px;
            height: 40px;
            border: 1px solid grey;
            float: right;
            line-height: 40px;
            font-size: 12px;
        }
        .hmsrw{
            color: grey;
            float:right;
            margin: 0 27px 0 0 ;

        }
        .hmsrt{
            float: left;
            margin: 12px 5px 0 30px;
        }
        .hmx{
            width: 730px;
            height: 40px;
            line-height: 40px;
        }
        .hmxc{
            font-size: 12px;
            color: grey;
            float: left;
            margin: 0 15px 0 0;
        }
        .hscx{
            width: 1200px;
            height: 40px;
            margin: 0 auto;
        }
        .hscxl{
            width: 210px;
            height: 40px;
            float: left;
            background-color: #000000;
            color: #ffffff;
            font-size: 16px;
            line-height: 40px;

        }
        .hltb{
            width: 20px;
            height: 15px;
            background-image: url('../project/mall/IMGsc/qtb.png');
            background-repeat: no-repeat;
            float: left;
            margin: 13px 15px 15px 33px;
        }
        .hscxr{
            width: 990px;
            height: 40px;
            float: left;
        }
        .hrdh{
            float:left;
            font-size: 16px;
            height: 40px;
            line-height: 40px;
            margin:0 11px;
        }
        .gwczj{
            min-width: 1200px;
            height: 380px;
            border: 1px solid gray;
            margin: 25px auto;
        }
        .wdgwc{
            min-width: 1200px;
            height: 52px;
            border-bottom: 1px solid gray;
        }
        .gwcwz{
            font-size: 19px;
            padding: 12px;
            color: #252525;
           }
        .spxx{
            width: 1200px;
            height: 330px;
            border-top:none;
        }
        .spt{
            width: 1160px;
            height: 130px;
            border: 1px solid grey;
        }
        .spts{
            width: 1160px;
            height: 40px;
            line-height: 40px;
            float: left;
            background-color:greenyellow;
            font-size: 14px;
            color: #ffffff;
        }
        .aspxx{
            width: 515px;
            height: 40px;
            float: left;
        }
        .adj{
            width: 155px;
            height: 40px;
            float: left;
        }
        .asl{
            width: 155px;
            height: 40px;
            float: left;
        }
        .axj{
            width: 155px;
            height: 40px;
            float: left;
        }
        .acz{
            width: 180px;
            height: 40px;
            float: left;
        }
        .sptx{
            width: 1160px;
            height: 90px;
            line-height: 90px;
            float: left;
        }
        .bspxx{
            width: 515px;
            height: 90px;
            float: left;
            font-size: 14px;
            color: grey;
        }
        .bdj{
            width: 155px;
            height: 90px;
            float: left;
            font-weight:bold;
            font-size: 17px;
        }
        .bsl{
            width: 155px;
            height: 90px;
            float: left;
        }
        .bxj{
            width: 155px;
            height: 90px;
            float: left;
            font-size: 20px;
            color: orangered;
        }
        .bcz{
            width: 180px;
            height: 90px;
            float: left;
            font-size: 14px;
            color: grey;
        }
        .spm{
            width: 1160px;
            height: 115px;
            position: relative;

        }
        .spzj{
            float: right;
            font-size: 18px;
            font-weight: bold;
            margin: 69px 0 0 0;
        }
        .sz{
            float: right;
            font-size: 35px;
            color: orangered;
            font-weight: bold;
            margin: 53px 0 0 0;
        }
        .spb{
            width: 1160px;
            height: 40px;
        }
        .jxgw{
            width: 140px;
            height: 38px;
            background-color: darkgray;
            color: grey;
            font-size: 19px;
            float: right;
            line-height: 38px;
            margin: 0px 15px;
            text-align: center;
        }
        .qjs{
            width: 140px;
            height: 38px;
            background-color:orangered;
            color:#ffffff;
            font-size: 19px;
            float: right;
            line-height: 38px;
            text-align: center;
        }
        .hsxr a{
            text-decoration: none;
            color: #333333;

        } .foot{
              min-width: 1200px;
              height: 420px;
          }
        .q{
            height: 90px;
            min-width: 1200px;
            border-top: 1px solid #e2e2e4;
            border-bottom: 1px solid #e2e2e4;
        }
        .fts{
            width: 1200px;
            height: 90px;
            margin: 0 auto;
        }
        .ftshz{
            width:299px;
            height: 60px;
            margin-top: 15px;
            float: left;
            border-right: 1px solid #e2e2e4;
        }
        .ftshzq{
            width: 40px;
            height:40px;
            background-image: url('../project/mall/IMGsc/yuan.png');
            float: left;
            text-align: center;
            color: limegreen;
            font-size: 21px;
            margin-top: 13px;
            margin-left: 75px;
        }

        .ftshzh{
            color: black;
            font-size: 18px;
            margin: 0 auto;
            float: left;
            text-align: center;
            margin-top: 15px;
            margin-left: 5px;
        }
        .ftz{
            width: 1200px;
            height: 250px;
            margin: 0 auto;
        }
        .mzt{
            width: 190px;
            height: 250px;
            margin: 0 auto;
            float: left;
        }
        .mztx{
            width: 200px;
            height: 30px;
            color: gray;
            font-size: 12px;
        }
        .mztd {
            width: 200px;
            height: 40px;
            color:#252525;
            font-size: 16px;
            margin-top: 30px;
        }
        .sph{
            width: 200px;
            height: 36px;
            float: left;
        }
        .ftx{
            width: 1200px;
            height: 80px;
            color: gray;
            font-size: 12px;
            text-align: center;
            margin: 0 auto;
        }


    </style>
</head>
<body>
<div>
    <div class="head">
        <div class="hnvgt">
            <div style="width: 1200px;height: 40px;margin: 0 auto">
                <div class="hnl">
                    <div class="xhnl">大客户采购</div>
                    <div class="xhnl">帮助中心</div>
                    <div class="xhnl">收藏本站</div>
                    <div class="xhnl">商品入驻</div>
                    <div class="xhnl">老人手环申请</div>
                    <div class="xhnl"><img src='../project/mall/IMGsc/phonetb.png' style="position: relative;top: 4px;right: 3px;">手机商城</div>
                </div>
                <div class="hnr">
                    <div class="xhnr">我的订单</div>
                    <div class="xhnr">F码购买</div>
                    <div class="xhnr">|</div>
                    <div class="xhnr">注册</div>
                    <div class="xhnr">登录</div>
                </div>
            </div>
        </div>
        <div class="hsearch">
            <div class="hsc">
                <div class="hscs">
                    <div class="hscsl"><div class="logo"><img src="../project/mall/IMGsc/logo.png"/></div> </div>
                    <div class="hscsm">
                        <div class="hm">
                            <div class="hms">
                                <div class="hmsl">
                                    <div class="dz">极米无屏电视</div>
                                    <div class="fdj"><img src='../project/mall/IMGsc/fdj.png' style="margin:12px 27px"></div>
                                </div>
                                <div class="hmsr"> <img src='../project/mall/IMGsc/gwctb.png'class="hmsrt">我的购物车(0)</div>
                            </div>
                            <div class="hmx">
                                <div class="hmxc">手机N4A</div>
                                <div class="hmxc">儿童手表C5</div>
                                <div class="hmxc">儿童机器人</div>
                                <div class="hmxc">安全路由5G</div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="hscx">
                    <div class="hscxl"><div class="hltb"></div><div>全部智能酷品</div></div>
                    <div class="hscxr">
                        <div class="hrdh" style="margin: 0 10px 0 40px ">手机</div>
                        <div class="hrdh">行车记录仪</div>
                        <div class="hrdh">儿童手表</div>
                        <div class="hrdh">摄像头</div>
                        <div class="hrdh">路由器</div>
                        <div class="hrdh">儿童机器人</div>
                        <div class="hrdh">老人手表</div>
                        <div class="hrdh">智品牌</div>
                        <div class="hrdh">社区</div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="gwczj" style="width: 1200px">
        <div class="wdgwc" style="width: 1200px"><div class="gwcwz">我的购物车</div></div>
        <div class="spxx" style="width: 1200px">
            <div style="width: 1160px;margin: 20px auto">
            <div class="spt">
                <div class="spts">
                    <div class="aspxx">商品信息</div>
                    <div class="adj">单价</div>
                    <div class="asl">数量</div>
                    <div class="axj">小计</div>
                    <div class="acz">操作</div>
                </div>
                <div class="sptx">
                    <div class="bspxx">普迪BYRD Premium1.0专业四轴航拍无人机尊爵黑(四轴 1080P相机 折叠)</div>
                    <div class="bdj">6488.00元</div>
                    <div class="bsl">数量</div>
                    <div class="bxj">6488.00元</div>
                    <div class="bcz">删除</div>
                </div>
            </div>
                <div class="spm">
                    <div class="spzj">元</div>
                    <div class="sz">6488.00</div>
                    <div class="spzj">商品总计：</div>
                </div>
            <div class="spb">
                <a href="../homework/xdpsdz.html"><div class="qjs">去结算</div></a>
                <div class="jxgw">继续购物</div>
            </div>
            </div>
        </div>
    </div>
    <div class="foot">
        <div class="q">
            <div class="fts">
                <div class="ftshz">
                    <div class="ftshzq">7</div>
                    <div class="ftshzh">&nbsp;7天无理由退货</div>
                </div>
                <div class="ftshz">
                    <div class="ftshzq">15</div>
                    <div class="ftshzh">&nbsp;15天免费换货</div>
                </div>
                <div class="ftshz">
                    <div class="ftshzq">包</div>
                    <div class="ftshzh">&nbsp;满99元包邮</div>
                </div>
                <div class="ftshz" style="border-right: none">
                    <div class="ftshzq">服</div>
                    <div class="ftshzh">&nbsp;手机特色服务</div>
                </div>
            </div></div>
        <div class="ftz">
            <div class="mzt">
                <div class="mztd">帮助中心</div>
                <div class="mztx">用户注册</div>
                <div class="mztx">用户登录与密码找回</div>
                <div class="mztx">购买指南</div>
                <div class="mztx">支付方式</div>
                <div class="mztx">配送与说明</div>
            </div>
            <div class="mzt">
                <div class="mztd">售后服务</div>
                <div class="mztx">7日无理由退货</div>
                <div class="mztx">质量问题15日内换货</div>
                <div class="mztx">保修条款</div>
                <div class="mztx">服务流程</div>
                <div class="mztx">安迷之家</div>
            </div>
            <div class="mzt">
                <div class="mztd">特色服务</div>
                <div class="mztx">F码通道</div>
                <div class="mztx">360生态</div>
            </div>
            <div class="mzt">
                <div class="mztd">推广合作</div>
                <div class="mztx">商品入驻</div>
                <div class="mztx">大客户采购</div>
            </div>
            <div class="mzt">
                <div class="mztd">关注柔柔商城</div>
                <div class="mztx">柔柔柔商城大事记</div>
            </div>
            <div class="mzt" >
                <div class="mztd">联系我们</div>
                <div class="sph">
                    <div style="width: 108px;height: 36px;float: left"><img src="../project/mall/IMGsc/onserver.png"></div>
                    <div style="width: 35px;height: 36px;float: left;margin-left: 10px"><img src="../project/mall/IMGsc/weixin.png"></div>
                    <div style="width: 36px;height: 36px;float: right"><img src="../project/mall/IMGsc/xinlang.png"></div>
                </div>
            </div>
            <div class="ftx">
                <div style="margin-top: 30px;clear:both;">柔柔柔商城&copy;2013-2016&nbsp;公司版权所有&nbsp;京ICP备08010314号-43&nbsp;京公网安备1100000200006号</div>
            </div>
        </div>
    </div>
</div>
</body>
</html>